<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@page import="java.io.*" %>
<%@page import="btsm.bean.sysPro, java.util.Map"%>
<%@page contentType="text/html; charset=utf-8"%>

<html>
    <head> 
        <title>BTS信息查询与决策系统</title>
<%
			{
				sysPro sPro = new sysPro(); 
%>			
    <script src="http://ditu.google.com/maps?file=api&amp;v=2&amp;key=<%=sPro.getMapKey()%>"
            type="text/javascript"></script>
    <script src="http://gmaps-utility-library.googlecode.com/svn/trunk/markermanager/release/src/markermanager.js"
                type="text/javascript"></script>
        
<style type="text/css"> 
</style>
</head>
<body  onunload="GUnload()" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">		
		
        <script type="text/javascript">

            //<![CDATA[
			var xmlHttp; 
			
			var btsBTSLIs = [];
			var defaultBTSLI = "./images/btsli/bts.png";
            var map = null;
            var mgr = null;
            var allmarkers = [];
			var allBTSCode = [];
			var allBTSName = [];
			var allBTSLevel = [];
			var allBTWRadius = [];
			var allBTSZone = [];
			var allLandform = [];
			var allRoad = [];
			var alldistanceC = [];
			var allarrivaltimeC = [];
			var alldistanceP = [];	
			var allarrivaltimeP = [];										
            
            var GXpolyPoints = Array();//此变量留做显示光纤线路使用。虽有赋值并未显示光纤；
			
            
            //基站有效作用半径，单位公里;
            var eDistance = 30;
            
            var highlightCircle;
            var currentMarker;
            var eRadius = 200;
			var bFullScreenMod = false;//全屏模式标志	
			
			var clat = <%=sPro.getCLat()%>;
			var clng = <%=sPro.getCLng()%>;		
				
			btsBTSLIs.length = 0;
			
<%
				Map<String, String> mapBTSLIs = sPro.getBtsLIs();
				String strBTSLI = "";
				for(int i = 0; i < mapBTSLIs.size(); ++i){
					strBTSLI = mapBTSLIs.get("btsl"+String.valueOf(i));
					if(strBTSLI == null || strBTSLI.equalsIgnoreCase("") || strBTSLI.equalsIgnoreCase("null"))
						strBTSLI = "./images/btsli/bts.png";
					%>
								btsBTSLIs.push("<%=strBTSLI%>");
					<%
				}
			}
%>		

            function highlightCurrentMarker(){

                var centerPoint = new GLatLng(clat, clng);
                var radiusPoint = new GLatLng(clat - eDistance / (1.853 * 60) , clng);

                var markerPoint = currentMarker.getPoint();
                var polyPoints = Array();

                if (highlightCircle) {
                    map.removeOverlay(highlightCircle);
                }

                var mapNormalProj = G_NORMAL_MAP.getProjection();
                var mapZoom = map.getZoom();
                var clickedPixel = mapNormalProj.fromLatLngToPixel(markerPoint, mapZoom);
                
                var centerPt = mapNormalProj.fromLatLngToPixel(centerPoint, mapZoom);
                var radiusPt = mapNormalProj.fromLatLngToPixel(radiusPoint, mapZoom);                

                with (Math) {
                    eRadius = floor(sqrt(pow((centerPt.x-radiusPt.x),2) + pow((centerPt.y-radiusPt.y),2)));
                    
                    var polyNumSides = 90;
                    var polySideLength = 4;

                    for (var a = 0; a<(polyNumSides+1); a++) {
                        var aRad = polySideLength*a*(Math.PI/180);
                        var polyRadius = eRadius; 
                        var pixelX = clickedPixel.x + polyRadius * Math.cos(aRad);
                        var pixelY = clickedPixel.y + polyRadius * Math.sin(aRad);
                        var polyPixel = new GPoint(pixelX,pixelY);
                        var polyPoint = mapNormalProj.fromPixelToLatLng(polyPixel,mapZoom);
                        polyPoints.push(polyPoint);
                    }
                }
                // Using GPolygon(points,  strokeColor?,  strokeWeight?,  strokeOpacity?,  fillColor?,  fillOpacity?)
                highlightCircle = new GPolygon(polyPoints,"#000000",2,0.0,"#00ff00",.5);
                map.addOverlay(highlightCircle);

				UpdateBtsInfoByID(currentMarker.value);
				
            }
            
            function clearMarkers() {
                //如果有高亮显示的基站则先删除高六显示
                if (highlightCircle) {
                    map.removeOverlay(highlightCircle);
                }                    
				
                mgr.clearMarkers();
            }

            function reloadMarkers() {
                //setupOfficeMarkers();
				mgr.clearMarkers();
				
                mgr.addMarkers(allmarkers, 6);
                mgr.refresh();
            }
			         
            function createMarker(point, strcode, iLevel) {
			
			    var re = /^[0-9]$/;

                var tinyIcon = new GIcon();
    			if (re.test(iLevel))
				    tinyIcon.image = btsBTSLIs[iLevel];
				else
					tinyIcon.image = defaultBTSLI;
					 
                tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
                tinyIcon.iconSize = new GSize(22, 22);
                tinyIcon.shadowSize = new GSize(22, 20);
                tinyIcon.iconAnchor = new GPoint(6, 20);
                tinyIcon.infoWindowAnchor = new GPoint(5, 1);

                //  GMarkerOptions 
                markerOptions = { icon:tinyIcon , draggable: false};			
			
                var marker = new GMarker(point, markerOptions);

                marker.value = strcode;

                // This line highlights the marker when it's clicked
                GEvent.addListener(marker, "click", function() {
                    currentMarker = marker;
                    highlightCurrentMarker();
                });

                // This line highlights the marker when its moused over
                GEvent.addListener(marker, "mouseover", function() {
                    currentMarker = marker;
                    highlightCurrentMarker();
	
					ShowFunElement('btsinfo'); //liugang 2009-05-23　位置调试					
                });

                // This line highlights the marker while dragging
                GEvent.addListener(marker, "drag", function() {
				    currentMarker = marker;
                    highlightCurrentMarker();	

                });

                return marker;
            }            
            
            function load() {

                map = new GMap2(document.getElementById("map_canvas"));
                map.addControl(new GLargeMapControl());
                map.addMapType(G_PHYSICAL_MAP);
                //map.addControl(new GMapTypeControl());
                map.addControl(new GMenuMapTypeControl());
                map.addControl(new GOverviewMapControl());
                map.addControl(new GScaleControl());

                map.setCenter(new GLatLng(clat, clng), 9);

                mgr = new MarkerManager(map, {trackMarkers:true});

                // Creates a marker at the given point with the given number label

                GEvent.addListener(map, "moveend", function() {
                    var center = map.getCenter();
					HideFunElement('btsquery');
					HideFunElement('btsinfo');	
                });
				
		        var polyline = new GPolyline([
  					new GLatLng(clat, clng),
	  		  		new GLatLng(clat + 0.058, clng + 0.050)
					], "#66CCFF", 10);
				map.addOverlay(polyline);
				                // This line highlights the marker when it's clicked
                GEvent.addListener(polyline, "click", function() {
                    confirm('线路单击！');
                });
				
            }


window.onload = load;			
			
function createXMLHttpRequest() {
    if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
}

 

function refreshModelList() {

    var strBTSName = document.getElementById("strBTSName").value;

    if(strBTSName == "") {
        clearModelsList();
        return;
    }
 
    var url = "btsQueryByNameServlet?"
        + createQueryString(strBTSName) + "&ts=" + new Date().getTime();
 
    createXMLHttpRequest();
    xmlHttp.onreadystatechange = handleStateChange;
    xmlHttp.open("GET", url, true);
    xmlHttp.send(null);
}

function createQueryString(strName) {

    var queryString = "strBTSName=" + strName;
    return queryString;

}
 
function handleStateChange() {

    if(xmlHttp.readyState == 4) {
        if(xmlHttp.status == 200) {
            updateModelsList();
        }
    }
}

 

function updateModelsList() {

    clearModelsList();

    var models = document.getElementById("models");
    var properties = xmlHttp.responseXML.getElementsByTagName("property");
    var option = null;
    var property = null;
    var btsName, btsCode, btszone, landform, btsLat, btsLng, btsLevel, btsWRadius;
	var btsRoad, btsalldistanceC, btsarrivaltimeC,  bdistanceP, barrivaltimeP;
    var marker, point;

    allmarkers.length = 0;
    GXpolyPoints.length = 0;
	mgr.clearMarkers();

	allBTSCode.length = 0;
	allBTSName.length = 0;
	allBTSLevel.length = 0;
	allBTWRadius.length = 0;
	allBTSZone.length = 0;
	allLandform.length = 0;
	allRoad.length = 0;
	alldistanceC.length = 0;
	allarrivaltimeC.length = 0;
	alldistanceP.length = 0;	
	allarrivaltimeP.length = 0;	

    for(var i = 0; i < properties.length; i++) {
        
        property = properties[i];
        option = document.createElement("option");
        btsCode = property.getElementsByTagName("btsCode")[0].firstChild.nodeValue;
	    btsName = property.getElementsByTagName("btsName")[0].firstChild.nodeValue;
		btszone = property.getElementsByTagName("btszone")[0].firstChild.nodeValue;
		landform = property.getElementsByTagName("landform")[0].firstChild.nodeValue;
        btsLat = property.getElementsByTagName("btsLat")[0].firstChild.nodeValue;
        btsLng = property.getElementsByTagName("btsLng")[0].firstChild.nodeValue;
		btsLevel = property.getElementsByTagName("btsLevel")[0].firstChild.nodeValue;
		btsWRadius = property.getElementsByTagName("wRadius")[0].firstChild.nodeValue;
		
		btsRoad = property.getElementsByTagName("btsRoad")[0].firstChild.nodeValue;
		btsalldistanceC = property.getElementsByTagName("distanceC")[0].firstChild.nodeValue;
		btsarrivaltimeC = property.getElementsByTagName("arrivaltimeC")[0].firstChild.nodeValue;
		bdistanceP = property.getElementsByTagName("distanceP")[0].firstChild.nodeValue;
		barrivaltimeP = property.getElementsByTagName("arrivaltimeP")[0].firstChild.nodeValue;
		
        point = new GLatLng(btsLat, btsLng);
        marker = createMarker(point, i, btsLevel);
        allmarkers.push(marker);
        GXpolyPoints.push(point);
		allBTSCode.push(btsCode);
		allBTSName.push(btsName);

		allBTSLevel.push(btsLevel);
		allBTWRadius.push(btsWRadius);

		allBTSZone.push(btszone);
		allLandform.push(landform);
		allRoad.push(btsRoad);
		alldistanceC.push(btsalldistanceC);
		allarrivaltimeC.push(btsarrivaltimeC);
		alldistanceP.push(bdistanceP);	
		allarrivaltimeP.push(barrivaltimeP);				
		
        option.appendChild(document.createTextNode(btsCode + btsName));
        models.appendChild(option);

    }
	
    //如果有高亮显示的基站则先删除高亮显示
    if (highlightCircle) {
         map.removeOverlay(highlightCircle);
    }        
    mgr.addMarkers(allmarkers, 2);//
    mgr.refresh();

}

function UpdateMapFocus() {
    var models = document.getElementById("models");

	map.panTo(GXpolyPoints[models.selectedIndex]);
    
	currentMarker = allmarkers[models.selectedIndex];  
	highlightCurrentMarker();
}

function UpdateBtsInfoByID(markIdx){

	document.getElementById("BtsInfoCode").innerHTML = allBTSCode[markIdx];
	document.getElementById("BtsInfoName").innerHTML = allBTSName[markIdx];
	document.getElementById("btszone").innerHTML = allBTSZone[markIdx];
	document.getElementById("landform").innerHTML = allLandform[markIdx];
	document.getElementById("btsRoad").innerHTML = allRoad[markIdx];
	document.getElementById("distanceCP").innerHTML = alldistanceC[markIdx] + "/" +  alldistanceP[markIdx];
	document.getElementById("arrivaltimeCP").innerHTML = allarrivaltimeC[markIdx] + "/" + allarrivaltimeP[markIdx];		

}

function clearModelsList() {
    var models = document.getElementById("models");
    while(models.childNodes.length > 0) {
        models.removeChild(models.childNodes[0]);
    }
}

function RemoveHighLight(){
    //如果有高亮显示的基站则删除
    if (highlightCircle) {
         map.removeOverlay(highlightCircle);
		 highlightCircle = null;
    }        	
}

function ShowFunElement(strElement){
  document.getElementById(strElement).style.display = "block";
}

function HideFunElement(strElement){
  document.getElementById(strElement).style.display = "none";
}	
    //]]>
</script>



<table width="100%" border="0">
  <tr>
    <td colspan="9"><div id="map_canvas" style="width: 100%; height: 400px"></div></td>
  </tr>
  <tr>
	<td width="80px" align="center"><input type="button" name="btbtsquery" value="　选项　" onClick="window.open('popbtsquery.jsp')"></td>
	<td width="80px" align="center"><input type="button" name="btbtsquery" value=" 分类查看 " onClick="window.open('popbtsquery.jsp')"></td>
	<td width="80px" align="center"><input type="button" name="btbtsquery3" value="　查询　" onClick="ShowFunElement('btsquery');"></td>
	<td width="80px" align="center">&nbsp;</td>
	<td width="80px" align="center"></td>
	<td width="80px" align="center"><input type="button" name="btbtsquery2" value="　测距　"></td>
	<td width="80px" align="center"><input id="reLoad" name="reload" type="button" onClick="reloadMarkers()" value="重新加载"></td>
    <td width="80px" align="center"><input id="btnClear" name="btnClear" type="button" onClick="RemoveHighLight()" value="　隐藏　"></td>
    <td height="20" align="center"></td>
  </tr>
</table>

<div id="btsquery" style="position:absolute; left:560px; top:100px; width:10px; height:10px; display:none">
<table width="100%" height="291" align="center" border="0" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">
  <tr>
    <td height="32" colspan="2" align="center" bgcolor="#FF9900"><span class="style1">基站/光纤查询</span></td>
  </tr>
  <tr>
    <td height="22" colspan="2" align="left" bgcolor="#99CCCC">请输入关键字(名称或者编号)：</td>
  </tr>
  <tr>
    <td width="171" height="25" bgcolor="EDF2FC"><input name="strBTSName" type="text" id="strBTSName" onKeyDown="if(event.keyCode==13){refreshModelList()};" size="21"></td>
    <td width="85" bgcolor="EDF2FC"><input name="button" type="button" id="btqQuery" onClick="refreshModelList();" value="　查询　"></td>
  </tr>
  <tr>
    <td height="143" bgcolor="EDF2FC" colspan="2"><select name="select" size="10" id="models" style="width:260px;height:200px" onkeypress="UpdateMapFocus();" onclick="UpdateMapFocus();">
    </select></td>
  </tr>
</table>
</div>

<div id="btsinfo" style="position:absolute; left:98px; top:10px; width:188px; height:248px; display:none">

<table width="178" height="248" bgcolor="#996633" align="center" border="0" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">
  <tr>
    <td height="27" align="center" bgcolor="#FF9900"><div id="BtsInfoName"> </div></td>
  </tr>
  <tr>
    <td width="176" bgcolor="EDF2FC"><div id="BtsInfoCode"> </div></td>
  </tr>
  <tr>
    <td bgcolor="EDF2FC"><div id="btszone"> </div></td>
  </tr>
  <tr>
    <td bgcolor="EDF2FC"><div id="landform"> </div></td>
  </tr>
  <tr>
    <td bgcolor="EDF2FC"><div id="btsRoad"> </div></td>
  </tr>
  <tr>
    <td bgcolor="EDF2FC"><div id="distanceCP"> </div></td>
  </tr>  
  <tr>
    <td bgcolor="EDF2FC"><div id="arrivaltimeCP"> </div></td>
  </tr>
  <tr>
    <td align="center" bgcolor="EDF2FC"><input type="button" name="detailBtn" value="　详细信息　" onClick="window.open('popbtsquery.jsp')"></td>
  </tr>
</table>

</div>
<script>
	 
</script>
</body>
</html>
